<html>
<head>
    <meta charset="utf-8">

</head>
<title>h5图片压缩与上传</title>
<style>
    .filePicker {
        background: none repeat scroll 0 0 #00B7EE;
        border-radius: 3px;
        box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
        color: #FFFFFF;
        cursor: pointer;
        display: inline-block;
        font-size: 18px;
        height: 44px;
        line-height: 44px;
        width: 90%;
        min-width: 120px;
        margin: 0 auto 0px;
        overflow: hidden;
        transition: background 0.2s;
        -moz-transition: background 0.2s;
        -webkit-transition: background 0.2s;
        -o-transition: background 0.2s;
    }

    #preview {
        margin-top: 30px;
    }

        #preview img {
            max-width: 30%;
        }
</style>

<div class="page" id="upload">
    <h2>UploadImg</h2>
    <div id="dd" class="filePicker">点击选择文件</div>
    <img id="resultImage" />
    <div id="preview"></div>
</div>
<script src="zepto.min.js"></script>
<script src="../src/h5upload.js"></script>
<script>
    
    $.fileUpload({ filebutton: "#dd", previewZoom: "#preview" });

</script>

</body>
</html>
